import {useReducer} from 'react'
let initialValue={
    num:0
}
/**
 * useReducer是对useState对升级处理
 *  + 普通需求处理的时候，基本都是useState直接处理，不会使用useReducer
 *  + 单数如果一个组件的逻辑很复杂，需要大量的状态/大量修改状态的逻辑，此时使用useReducer管理这些状态会更好一些
 *      @1 不需要再基于useState一个个点去创建状态了
 *      @2 所有状态修改的逻辑，全部统一化处理了！！
 */
let reducer = (state,action)=>{
    state = {...state}
    switch(action.type){
        case 'sup':
            state.num++;
            break;
        case 'opp':
            state.num--;
            break;
        default:
    }
    return state
}
function A1(){
    let [state,dispatch] = useReducer(reducer,initialValue)
    return <div>
        <span>{state.num}</span>
        <br />
        <button onClick={()=>{
            dispatch({
                type:'sup'
            })
        }}>增加</button>
         <br />
        <button onClick={()=>{
            dispatch({
                type:'opp'
            })
        }}>减少</button>
    </div>
}
export default A1
